<template>
  <div class="global-container">
    <div class="search">
      <el-form ref="form" :model="searchData" inline>
        <el-form-item label="证书编号" prop="certCode">
          <el-input v-model="searchData.certCode"></el-input>
        </el-form-item>
<!--        <el-form-item label="证书类型" prop="bussType">-->
<!--          <el-input v-model="searchData.name"></el-input>-->
<!--        </el-form-item>-->
        <el-form-item label="申请人/申请单位" prop="appPer">
          <el-input v-model="searchData.appPer"></el-input>
        </el-form-item>
        <el-form-item label="聘用单位" prop="employUnit">
          <el-input v-model="searchData.employUnit"></el-input>
        </el-form-item>
        <el-form-item label="证照状态" prop="isValid">
          <Aselect v-model="searchData.isValid" :options="[
            { label: '有效', value: '1' },
            { label: '过期', value: '0' },
            { label: '注销', value: '2'}
          ]" />
        </el-form-item>
        <el-form-item label="发证日期" prop="certTimeRange">
          <AdatePicker v-model="searchData.certTimeRange" type="daterange"></AdatePicker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="getTable(true)">查询</el-button>
          <el-button type="primary" size="mini" @click="reset">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <Atable :tableData="tableData" :tableModel="tableModel">
      <template #actions="{ row }">
        <el-button @click="view(row)" type="primary" size="small"
          >下载</el-button
        >
      </template>
    </Atable>
    <PageSize
        ref="pageSize"
        :total="pageParams.total"
        :pageNum="pageParams.pageNo"
        :pageSize="pageParams.pageSize"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
    ></PageSize>
  </div>
</template>
<script>
import Atable from '@/components/Table/Atable';
import AdatePicker from '@/components/TimePicker/AdatePicker';
import Aselect from '@/components/Select/Aselect';
import PageSize from '@/components/PageSize/PageSize';
import businessApi from '@/api/business';
export default {
  components: { Atable, AdatePicker, Aselect, PageSize },
  data() {
    return {
      previewVisible: false,
      previewUrl: '',
      pageParams: {
        pageNo: 1,
        pageSize: 10,
        total: 0,
      },
      searchData: {
        certCode: null,
        appPer: null,
        employUnit: null,
        isValid: null,
        certTimeRange: null,
        // certStatus 1:已发证
        certStatus: 1
      },
      bussTypeMap: {
        '1': '二级造价工程师（水利工程）初始注册',
        '2': '二级造价工程师（水利工程）延续注册',
        '3': '二级造价工程师（水利工程）变更注册',
        '4': '二级造价工程师（水利工程）注销注册',
        '5': '水利工程质量检测单位资质认定（乙级）-常规审批制',
        '6': '水利工程质量检测单位资质认定（乙级）认定-初次申领',
        '7': '水利工程质量检测单位资质认定（乙级）认定-延续申请',
        '8': '水利工程质量检测单位资质认定（乙级）认定-变更申请',
        '9': '水利工程质量检测单位资质认定（乙级）认定-注销申请',
        'a': '三类人员安全生产考核合格证书-初次申领',
        'b': '三类人员安全生产考核合格证书-延续申请',
        'c': '三类人员安全生产考核合格证书-变更申请',
        'd': '三类人员安全生产考核合格证书-注销申请',
      },
      certTypeMap: {
        '1': '二级造价工程师（水利工程）',
        '2': '水利工程质量检测单位资质认定（乙级）',
        '3': '三类人员安全生产考核合格证书'
      },
      tableData: [],
      tableModel: [
        {
          prop: 'num',
          label: '序号',
          width: '50',
        },
        {
          prop: 'certCode',
          label: '证书编号',
        },
        {
          prop: 'certType',
          label: '证书类型',
          render: (row) => {
            return this.certTypeMap[row.certType];
          },
        },
        {
          prop: 'appPer',
          label: '申请人',
          // render: (row) => {
          //   return row.appPer || row.appUnit;
          // },
        },
        {
          prop: 'employUnit',
          label: '聘用单位',
        },
        {
          prop: 'validTime',
          label: '有效期',
          render: (row) => {
            if (row.effStartTime && row.effEndTime) {
              return `${row.effStartTime}至${row.effEndTime}`;
            }
            return '';
          },
        },
        {
          prop: 'certTime',
          label: '发证日期',
        },
        {
          prop: 'actions',
          label: '操作',
          width: '100',
          slot: 'actions',
        },
      ],
    };
  },
  mounted() {
    this.getTable();
  },
  computed: {
    userType() {
      return this.$store.state.user.userInfo.userType;
    },
    userCertType() {
      if ((this.userType.includes('5') && this.userType.includes('6')) || this.userType.includes('7')) {
        return undefined;
      } else if (this.userType.includes('5')) {
        return 1;
      } else if (this.userType.includes('6')) {
        return 2;
      }
      return undefined;
    }
  },
  methods: {
    async getTable(searching=false) {
      this.tableData = [];
      if (searching) {
        this.pageParams.pageNo = 1;
      }
      let params = {
        ...this.pageParams,
        ...this.searchData,

        certType: this.userCertType,
      }
      if (this.searchData.isValid == '2') {
        params = {
          ...params,
          certStatus: '0',
          bussType: '4,9,d',
          isValid: undefined,
          status: '5'
        }
      }
      if (this.searchData.certTimeRange && this.searchData.certTimeRange.length > 0) {
        params.certStartTime = this.searchData.certTimeRange[0];
        params.certEndTime = this.searchData.certTimeRange[1];
      }
      businessApi.getStepsList(params).then(res => {
        if (res && res.records) {
          const records = res.records.map(item => {
            const num = (res.current - 1) * res.size + res.records.indexOf(item) + 1;
            return {
              ...item,
              num: num,
            };
          });
          this.tableData = records;
          this.pageParams.total = res.total;
        }

      });
    },
    reset() {
      this.searchData = {
        // certStatus 1:已发证
        certStatus: 1
      };
      this.pageParams.pageNo = 1;
      this.getTable();
    },
    view(row) {
      businessApi.getCertificateById({
        id: row.id
      }).then(res => {
        // const { fileUri } = res.certFile;
        if (res.certFile && res.certFile.fileUri) {
          // download ofd
          window.location.href = res.certFile.fileUri;
          // this.previewUrl = fileUri;
          // this.previewVisible = true;
        } else {
          this.$message.error('暂无证书');
        }
      })

    },
    handleSizeChange(val) {
      this.pageParams.pageSize = val;
      this.getTable();
    },
    handleCurrentChange(val) {
      this.pageParams.pageNo = val;
      this.getTable();
    },
  },
};
</script>
<style lang="scss" scoped></style>
